<template>
  <div>
    <!-- 
        http 请求的八种方式
        1、OPTIONS
        返回服务器针对特定资源所支持的HTTP请求方法，也可以利用向web服务器发送‘*’的请求来测试服务器的功能性
        2、HEAD
        向服务器索与GET请求相一致的响应，只不过响应体将不会被返回。这一方法可以再不必传输整个响应内容的情况下，就可以获取包含在响应小消息头中的元信息。
        3、GET
        向特定的资源发出请求。注意：GET方法不应当被用于产生“副作用”的操作中，例如在Web Application中，其中一个原因是GET可能会被网络蜘蛛等随意访问。Loadrunner中对应get请求函数：web_link和web_url
        4、POST
        向指定资源提交数据进行处理请求（例如提交表单或者上传文件）。数据被包含在请求体中。POST请求可能会导致新的资源的建立和/或已有资源的修改。 Loadrunner中对应POST请求函数：web_submit_data,web_submit_form
        5、PUT
        向指定资源位置上传其最新内容
        6、DELETE
        请求服务器删除Request-URL所标识的资源
        7、TRACE
        回显服务器收到的请求，主要用于测试或诊断
        8、CONNECT
        HTTP/1.1协议中预留给能够将连接改为管道方式的代理服务器。
        http
        首先建立tcp链接
        1、客户端连接到Web服务器
        一个HTTP客户端，通常是浏览器，与Web服务器的HTTP端口（默认为80）建立一个TCP套接字连接。例如，http://www.baidu.com

        2、发送HTTP请求
        通过TCP套接字，客户端向Web服务器发送一个文本的请求报文，一个请求报文由请求行、请求头部、空行和请求数据4部分组成。

        3、服务器接受请求并返回HTTP响应
        Web服务器解析请求，定位请求资源。服务器将资源复本写到TCP套接字，由客户端读取。一个响应由状态行、响应头部、空行和响应数据4部分组成。
        4、释放连接TCP连接
        若connection 模式为close，则服务器主动关闭TCP连接，客户端被动关闭连接，释放TCP连接;若connection 模式为keepalive，则该连接会保持一段时间，在该时间内可以继续接收请求;

        5、客户端浏览器解析HTML内容
        客户端浏览器首先解析状态行，查看表明请求是否成功的状态代码。然后解析每一个响应头，响应头告知以下为若干字节的HTML文档和文档的字符集。客户端浏览器读取响应数据HTML，根据HTML的语法对其进行格式化，并在浏览器窗口中显示。
             -->
    <!-- 
        promise优点

        1、主要用于异步计算
        2、可以将异步操作队列化，按照期望的顺序执行，返回符合预期的结果
        3、可以在对象之间传递和操作promise，帮助我们处理队列

        promise是个构造函数 有resolve reject race等静态方法 他的原型prototype上有then catch方法  只要作为promise的实例 都可以调用promise上的方法
        如何promise加载图片
        
        最基本的promise格式
        function loadImage(src){
            const promise = new promise()
            return promise
        }

         
        实例化promise
        function loadImage(src){    这两个参数也是个函数   
        const promise = new promise((resolve,reject)=>{
            定义图片 然后会创建一个img元素
            const img = document.creatElement("img");
            给img加一个事件,如果创建成功
            img.onload = function(){
                成功为resolve
                resolve(img)  相当于log打印这个img
            }
            给img加一个事件,当img创建失败时
            img.onerror = function(){
                失败为reject
                const error = new Error("图片加载失败,url为${src}")
                reject(error)
            }
            这个img的src 设置成我们实例化promise 的参数
            img.src = src
        })

        return promise
        }
        然后可以通过调用这个方法loadImage() 实参传一个我们要使用的url
        如果图片加载成功,可以通过.then中放上面我们加载成功的img 然后写一个箭头函数
        loadImage(url1).then(img1=>{
        console.log("img1",img1)
        第一张图片加载成功想要第二章图片可以使用return 然后再次调用这个方法括号中放我们的第二张图片
        先打印第一张在打印第二张
        return loadImage(url2)
        然后如果加载成功可以看到img元素
        }).then(img2=>{
            console.log("img2",img2)
        }).catch(e=>{
        加载失败会到catch
        console.log("error",e)
        加载失败会显示图片加载失败
            error = e
        })
         -->
  </div>
</template>